<template>
    <!-- Echarts 的容器 -->
    <div ref="chart" style="width: 420px; height: 250px; margin-top:-59px;"></div>
</template>

<script>
import * as echarts from "echarts";

export default {
  data() {
    return {};
  },
  mounted() {
    // 绘制图表
    this.initChart();
  },
  methods: {
    initChart() {
      // 基于准备好的dom，初始化echarts实例
      var myChart = echarts.init(this.$refs.chart);

      // 指定图表配置项和数据
      var option =option = {
//   legend: {
//     top: 'bottom'
//   },
  toolbox: {
    show: true,
  },
  series: [
    {
      name: 'Nightingale Chart',
      type: 'pie',
      radius: [12, 75],
      center: ['50%', '50%'],
      roseType: 'area',
      itemStyle: {
        borderRadius: 6
      },
      data: [
        { value: 40, name: '6：00-9：00' },
        { value: 38, name: '9：00-12：00' },
        { value: 32, name: '12：00-15：00' },
        { value: 30, name: '15：00-18：00' },
        { value: 28, name: '18：00-21：00' },
        { value: 26, name: '21：00-24：00' },
        { value: 18, name: '24：00-6：00' }
      ]
    }
  ]
};

      myChart.setOption(option);
    },
  },
};
</script>
